<template>
	
</template>

<script>
export default {
	props: {
		site: {
			type: Object,
			default: () => ({})
		}
	},
	data() {
		return {};
	},
	methods: {
		
	}
};
</script>

<style lang="scss">
.site-item {
	border-radius: 16rpx;
	background-color: #ffffff;
	padding: 20rpx;
	margin-bottom: 20rpx;
	box-shadow: 0 0 6px 1rpx rgba(0, 0, 0, 0.1);

	.title {
		border-bottom: 1rpx solid #eee;
		padding-bottom: 10rpx;
		.title-l {
			flex: 1;
			flex-shrink: 0;
			overflow: hidden;
			& > view:nth-child(1) {
				font-weight: 800;
				font-size: 32rpx;
				margin-bottom: 10rpx;
			}
			& > view:nth-child(2) {
				font-size: 28rpx;
				color: #808080;
			}
		}
		.title-r {
			width: 200rpx;
			font-weight: 600;
			color: $uni-color-primary;
		}
	}
	.bucket-list {
		.bucket {
			padding: 10rpx 0;
			padding-bottom: 20rpx;
			.bucket-l {
				flex: 1;
				flex-shrink: 0;
				overflow: hidden;
				margin-right: 10rpx;
				.name {
					color: #333333;
					font-size: 32rpx;
					margin-bottom: 10rpx;
					font-weight: 600;
				}
				.info text {
					font-size: 28rpx;
					margin-right: 20rpx;
					color: #808080;
				}
			}
			.btn-supply {
				align-self: flex-end;
				width: 120rpx;
				height: 50rpx;
				line-height: 50rpx;
				border-radius: 25rpx;
				text-align: center;
				background-color: $uni-color-primary;
				color: #ffffff;
			}
		}
	}
}
</style>
